<!-- vis type specific options -->
<div class="form-group">
  <label>Map type</label>
    <select name="agg"
    class="form-control"
    ng-model="vis.params.mapType"
    ng-init="vis.params.mapType || vis.type.params.mapTypes[0]"
    ng-options="mapType as mapType for mapType in vis.type.params.mapTypes"
    >
  </select>
</div>

<div ng-if="vis.params.mapType === 'Heatmap'" class="form-group">
  <div>
    <label>
      Radius
      &nbsp;<kbn-info placement="right" info="Size of heatmap dots. Default: 25"></kbn-info>
    </label>
    <div class="vis-editor-agg-form-row">
      <input
        name="heatRadius"
        ng-model="vis.params.heatRadius"
        required
        class="form-control"
        type="range"
        min="5"
        max="50"
        step="1"
        >
      <div class="form-group vis-editor-agg-form-value">
        {{vis.params.heatRadius}}
      </div>
    </div>
  </div>
  <div>
    <label>
      Blur
      &nbsp;<kbn-info placement="right" info="Amount of blur applied to dots. Default: 15"></kbn-info>
    </label>
    <div class="vis-editor-agg-form-row">
      <input
        name="heatBlur"
        ng-model="vis.params.heatBlur"
        required
        class="form-control"
        type="range"
        min="1"
        max="25"
        step="1"
        >
      <div class="form-group vis-editor-agg-form-value">
        {{vis.params.heatBlur}}
      </div>
    </div>
  </div>
  <div>
    <label>
      Maximum zoom
      &nbsp;<kbn-info placement="right" info="Map zoom at which all dots are displayed at full intensity. Default: 16"></kbn-info>
    </label>
    <div class="vis-editor-agg-form-row">
      <input
        name="heatMaxZoom"
        ng-model="vis.params.heatMaxZoom"
        required
        class="form-control"
        type="range"
        min="1"
        max="18"
        step="1"
        >
      <div class="vis-editor-agg-form-value">
        {{vis.params.heatMaxZoom}}
      </div>
    </div>
  </div>
  <div>
    <label>
      Minimum opacity
      &nbsp;<kbn-info placement="right" info="Minimum opacity of dots. Default: 0.1"></kbn-info>
    </label>
    <div class="vis-editor-agg-form-row">
      <input
        name="heatMinOpacity"
        ng-model="vis.params.heatMinOpacity"
        required
        class="form-control"
        type="range"
        min="0"
        max="1.0"
        step="0.01"
        >
      <div class="vis-editor-agg-form-value">
        {{vis.params.heatMinOpacity}}
      </div>
    </div>
  </div>

</div>

<vislib-basic-options></vislib-basic-options>

<div class="vis-option-item form-group">
  <label>
    <input type="checkbox"
    name="isDesaturated"
    ng-disabled="!vis.type.params.canDesaturate"
    ng-model="vis.params.isDesaturated">

    Desaturate map tiles

    <kbn-info info="Reduce the vibrancy of tile colors, this does not work in any version of Internet Explorer"></kbn-info>
  </label>
</div>

<div class="vis-option-item form-group">
  <label>
    <input type="checkbox"
    name="wms.enabled"
    ng-model="vis.params.wms.enabled">

    WMS compliant map server

    <kbn-info info="Use WMS compliant map tile server. For advanced users only."></kbn-info>
  </label>
</div>

<div ng-show="vis.params.wms.enabled" class="well">
  <div class="vis-option-item form-group">

    <p>
      WMS maps are 3rd party mapping services that have not been verified to work with Kibana.
      These should be considered expert settings.
    </p>

    <label>
      WMS url*
    </label>
    <input type="text" class="form-control"
      name="wms.url"
      ng-model="vis.params.wms.url">
  </div>

  <div class="vis-option-item form-group">
    <label>
      WMS layers* <kbn-info info="A comma seperated list of layers to use."></kbn-info>
    </label>
    <input type="text" class="form-control"
      ng-require="vis.params.wms.enabled"
      ng-model="vis.params.wms.options.layers"
      name="wms.options.layers">
  </div>

  <div class="vis-option-item form-group">
    <label>
      WMS version* <kbn-info info="The version of WMS the server supports"></kbn-info>
    </label>
    <input type="text" class="form-control"
      name="wms.options.version"
      ng-model="vis.params.wms.options.version">
  </div>

  <div class="vis-option-item form-group">
    <label>
      WMS format* <kbn-info info="Usually image/png or image/jpeg. Use png if the server will return transparent layers"></kbn-info>
    </label>
    <input type="text" class="form-control"
      name="wms.options.format"
      ng-model="vis.params.wms.options.format">
  </div>

  <div class="vis-option-item form-group">
    <label>
      WMS attribution <kbn-info info="Attribution string for the lower right corner<"></kbn-info>
    </label>
    <input type="text" class="form-control"
      name="wms.options.attribution"
      ng-model="vis.params.wms.options.attribution">
  </div>

  <div class="vis-option-item form-group">
    <label>
      WMS styles* <kbn-info info="A comma seperated list of WMS server supported styles to use. Blank in most cases."></kbn-info>
    </label>
    <input type="text" class="form-control"
      name="wms.options.styles"
      ng-model="vis.params.wms.options.styles">
  </div>

  <p>* if this parameter is incorrect, maps will fail to load.</p>


</div>
